<template>
    <div>
        <!-- 组件的结构 -->
        <h1 class="sheet">学校名称：{{schoolName}}</h1>
    </div>
</template>


<script>
    // 组件的逻辑、交互
    export default {
        name: 'School',
        data() {
            return {
                schoolName: '北京大学'
            }
        },
        methods: {
            changeName() {
                this.schoolName = '清华大学'
            }
        },
    }
</script>

<style>
    /* 组件的样式 */
    .sheet {
        color: red;
    }
</style>